<!--公司账户-->
<template>
  <div class="system">

    <div class="my_header">
      <i class="mui-icon mui-icon-arrowleft" aria-hidden="true" @click="$router.back(-1)"></i>
      <div class="top1">系统信息</div>

    </div>
    <div class="sysitem" v-for="msitem in messagelist" @click="gomsgdetail(msitem.message_id)">
      <div class="time">
        {{msitem.add_time}}
      </div>
      <div class="infotype" :class="msitem.is_read==0?'isread':''">
        {{msitem.type}}
      </div>
      <div class="info">
        <div class="left">{{msitem.content}}</div>
        <div class="right"><img src="static/imgs/icon_more.png"></div>
      </div>
    </div>


  </div>
</template>

<script>
  export default {

    data() {
      return {
        messagelist: []
      };
    },
    created: function () {
      var token = localStorage.getItem("token");
      var that = this;

      that.getmessagelist(token);
    },
    methods: {
      gomsgdetail(aa) {
        var that = this;

        that.$router.push({
          path: './sysinfodetail',
          query: {
            tabitem: aa

          }
        });
      },

//			gocener() {
//				var that = this;
//				if(that.usertype == 1) {
//					that.$router.push({
//						path: './Personalcenter'
//
//					});
//				} else {
//					that.$router.push({
//						path: './corporatecenter'
//
//					});
//				}
//			},
      getmessagelist() {
        var that = this;
        $.ajax({
          type: "get",
          url: "http://zcapi.hrgsxt.cn/api/User_message/index",
          data: {
            token: localStorage.getItem("token"),

          },
          cache: false,
          dataType: "json",
          success: function (data) {
            console.log(JSON.stringify(data.data));
            if (data.code == 200) {

              that.messagelist = data.data;

              console.log("哈哈" + JSON.stringify(that.messagelist) + "哈哈1");

            } else {

              that.$toast({
                message: data.message,
                duration: 1000
              })

            }

          }
        });
      }

    },

    watch: {
      // 如果路由有变化，会再次执行该方法
      '$route': 'fetchData'
    }
  }

  //图片上传并预览
</script>

<style scoped>
  .system {
    margin-top: 1.2rem;

  }

  .isread:after {
    content: "";
    width: 0.12rem;
    height: 0.12rem;
    position: absolute;
    border-radius: 50%;
    top: 44%;
    left: 25%;
    background-color: #FF7E00;
  }

  .system .sysitem {
    width: 92%;
    margin-left: 4%;
    background-color: #FFFFFF;
    border-radius: 0px;
    margin-top: 0.2rem;
    padding: 10px 20px;
    border: .001rem dashed #ccc;
    position: relative;
  }

  .system .sysitem .time {
    height: 0.40rem;
    line-height: 0.40rem;
    text-align: center;

    color: #999999;
    font-size: 0.22rem;

  }

  .system .sysitem .infotype {
    height: 0.35rem;
    /* line-height: 0.3rem; */
    margin-top: .1rem;
    color: #333333;
    font-size: 0.3rem
  }

  .system .sysitem .info {
    height: 0.54rem;
    line-height: 0.54rem;
    color: #666666;
    font-size: 0.3rem
  }

  .system .sysitem .info .left {
    font-size: .26rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 90%;
    float: left;
  }

  .system .sysitem .info .right {
    text-align: right;
    width: 10%;
    float: right;
  }

  .system .sysitem .info .right img {
    width: .14rem;
    height: .24rem;
  }

  .row .right img {
    width: 8px;
    height: 14px;
    vertical-align: middle;
    margin-bottom: 3px;
    margin-left: 5px;
  }

  .error {
    color: #FC355D;
  }

  /*查询记录*/

  .margintop10 {
    margin-top: 10px;
  }

  .my_header .top1 {
    margin-right: 20px;
  }

  .my_header {
    height: .88rem;
    background: rgba(0, 133, 240, 1);
    text-align: center;
    color: #fff;
    line-height: .88rem;
    position: relative;
    padding: 0 .3rem;
    position: fixed;
    width: 100%;
    top: 0;
    z-index: 999;
  }

  .my_header i {
    font-size: .4rem;
    float: left;
    line-height: .88rem;
  }

  .myaccount .my_header .top1 {
    width: 40%;
    margin-left: 25%;
    float: left;
    text-align: center;
  }

  .myaccount .my_header .cmaccount {
    float: right;
    font-size: 0.28rem;
  }
</style>
